<template>
    <div>
        <div class="container">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                   <i class="el-icon-s-platform"></i> 商户信息
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <hr>
            <h3>商户信息</h3>
            <table border  cellspacing="0">
                <tr v-for="el in arr">
                    <td class="pd tc bg">{{el.user}}</td>
                    <td class="pd tc wd">{{el.name}}</td>
                    <td class="pd tc bg">{{el.license}}</td>
                    <td class="pd tc wd">{{el.num}}</td>
                </tr>
            </table>
            <table border cellspacing="0">
                <tr v-for="el in arr1">
                    <td class="pd tc bg">{{ el.list }}</td>
                    <td class="pd tc wd2">{{ el.cont }}</td>
                </tr>
            </table>
            <h3>商户照片</h3>
            <div>
                <span>门框照片：</span>
                <el-image
                class="mg"
                style="width: 150px; height: 100px"
                :src="url"
                ></el-image>
                <span>门框照片：</span>
                <el-image
                class="mg"
                style="width: 150px; height: 100px"
                :src="url"
                ></el-image>
                <span>门框照片：</span>
                <el-image
                class="mg"
                style="width: 150px; height: 100px"
                :src="url"
                ></el-image>
                <el-image
                class="mg"
                style="width: 150px; height: 100px"
                :src="url"
               ></el-image>
            </div>
        </div>
    </div>
</template>

<script>
import { fetchData } from '../../../api/index';
export default {
    name: 'basetable',
    data() {
        return {
            arr:[
                {user:'商品名称',name:'11',license:'营业执照号码',num:'1123456'},
                {user:'负责人',name:'11',license:'负责人手机号',num:'1123456'},
                {user:'身份证',name:'111454568',license:'经营区域',num:'焦作市山阳区'},
                {user:'注册时间',name:'2022-10-10 11:09',license:'审核状态',num:'未审核'},
            ],
            arr1:[
                {list:'详细地址',cont:'上扬去迎宾路32号'},
                {list:'商家介绍',cont:'主要经营汽车维修、保养、美容'}
            ],
            url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
        };
    },
    created() {
        this.getData();
    },
    methods: {
        // 获取 easy-mock 的模拟数据
        getData() {
            fetchData(this.query).then(res => {
                console.log(res);
                this.tableData = res.list;
                this.pageTotal = res.pageTotal || 50;
            });
        },
        //返回按钮
        backBtn(){
            this.$router.back();
        }
    }
};
</script>

<style scoped>
h3{
    margin: 10px 0px;
}
table{
    width: 100%;
    border-color: rgb(251, 251, 251);
}
.mg{
    margin: 0 20px;
}
.wd{
    width: 300px;
}
.wd2{
    width: 1015px;
}
.tc{
    text-align: center;
}
.pd{
    padding: 20px 30px;
    flex-grow: 1;
}
.bg{
    background-color: rgb(239,239,239);
}
</style>
